<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>회원가입 | WebCafe</title>
<link rel="stylesheet" type="text/css" href="css/import.css" />
<link rel="stylesheet" type="text/css" href="css/member.css" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="css/ie6.css">
<![endif]-->
</head>
<body>
<div id="wrapper">
  <!-- 헤더 시작 -->
  <div id="header">
    <h1 class="logo"><a href="index.html"><img src="images/common/logo.gif" alt="WebCafe" /></a></h1>
    <ul id="infoMenu">
      <li class="first-item"><a href="index.html">홈</a></li>
      <li><a href="#">로그인</a></li>
      <li><a href="join.html">회원가입</a></li>
      <li><a href="#">사이트맵</a></li>
      <li><a href="#">ENGLISH</a></li>
    </ul>
    <h2>주메뉴</h2>
    <ul id="navigation">
      <li class="first"><a href="introduce.html"><img src="images/common/topmenu01_ov.gif" alt="HTML에 대해" width="124" height="43" /></a>
        <ul id="naviSub01">
          <li><a href="#">(X)HTML 소개</a></li>
          <li><a href="#">레퍼런스 소개</a></li>
          <li><a href="#">활용예제</a></li>
        </ul>
      </li>
      <li><a href="#"><img src="images/common/topmenu02.gif" alt="CSS에 대해" width="108" height="43" /></a></li>
      <li><a href="#"><img src="images/common/topmenu03.gif" alt="웹 표준" width="90" height="43" /></a></li>
      <li><a href="#"><img src="images/common/topmenu04.gif" alt="웹 접근성" width="101" height="43" /></a></li>
      <li><a href="qna.html"><img src="images/common/topmenu05.gif" alt="묻고 답하기" width="109" height="43" /></a></li>
      <li><a href="gallery.html"><img src="images/common/topmenu06.gif" alt="자료실" width="93" height="43" /></a></li>
    </ul>
  </div>
  <hr />
  <!-- 헤더 끝 -->
  <div id="contents">
    <!-- 사이드 시작 -->
    <div id="subWrap">
      <div class="subMenu">
        <h2><img src="images/member/h2_member.gif" alt="회원관련" /></h2>
        <ul>
          <li class="select"><a href="join.html">회원가입</a></li>
          <li><a href="#">로그인</a></li>
          <li><a href="#">ID/PW 찾기</a></li>      
        </ul> 
      </div>
      <div class="search">
        <form action="">
          <fieldset>
          <legend>검색어 입력폼</legend>
            <label for="search"><img src="images/common/icon_searcgh.gif" alt="자료검색" /></label>
            <input type="text" id="search" size="14" />
            <input type="image" class="btnSearch" src="images/common/btn_search_sub.gif" alt="검색" />
          </fieldset>
        </form>
      </div>
    </div>
    <!-- 사이드 끝 -->
    <!-- 콘텐츠 시작 -->
    <div id="contentsWrap">
      <div class="location">
        <p class="depth">Home &gt;<strong class="current"> 회원가입</strong></p>             
      </div>      
      <h1><img src="images/member/h1_join.gif" alt="회원가입" /></h1>
      <div id="contentsArea">        
        <p class="joinInformation"><img src="images/member/icon_check.gif" alt="필수" /> 는 필수입력 항목입니다.</p>
        <form action="" method="post">
          <fieldset>      
          <legend>회원가입 정보 입력</legend>
          <table width="100%" border="1" cellspacing="0" cellpadding="0" class="joinData" summary="총 9개의 입력항목">
          <caption>회원가입 정보 입력폼</caption>
            <tbody>
            <tr>
              <th scope="row"><img src="images/member/icon_check.gif" alt="필수" />
                <label for="username">이름</label></th>
              <td><input type="text" name="username" id="username" class="textBox" /></td>
            </tr>
            <tr>
              <th><img src="images/member/icon_check.gif" alt="필수" />
                <label for="userid">사용자아이디</label></th>
              <td><input type="text" name="userid" id="userid" class="textBox" /> 
              <a href="pop_idcheck.html" onclick=""><img src="images/member/btn_idckeck.gif" alt="ID중복확인" /></a></td>
            </tr>
            <tr>
              <th><img src="images/member/icon_check.gif" alt="필수" /> 
              <label for="passwd">패스워드</label></th>
              <td class="inform"><p class="password">영문/숫자 4~10자 이내</p>
                <input type="password" name="passwd" id="passwd" class="textBox" /></td>
            </tr>
            <tr>
              <th><img src="images/member/icon_check.gif" alt="필수" /> 
              <label for="repassword">패스워드 확인</label></th>
              <td><input type="password" name="repassword" id="repassword" class="textBox" /></td>
            </tr>
            <tr>
              <th><label for="zipcd" class="gap">주소</label></th>
              <td><input type="text" class="textBox" name="zipcd" id="zipcd" maxlength="3" size="3" title="우편번호 앞자리" /> - 
                <input type="text" class="textBox" name="zipcd2" maxlength="3" size="3" title="우편번호 뒷자리" />
                <a href="pop_addrcheck.html" onclick=""> <img src="images/member/btn_addrckeck.gif" alt="우편번호 찾기" /></a><br />
                <input type="text" name="address" maxlength="100" size="57" class="textBox" /></td>
            </tr>
            <tr>
              <th><label for="telno" class="gap">전화번호</label></th>
              <td><input type="text" name="telno" maxlength="3" size="3" title="전화번호첫째자리" id="telno" class="textBox" /> - 
              <input type="text" name="telno2" maxlength="4" size="4" title="전화번호중간자리" class="textBox" /> -
              <input type="text" name="telno3" maxlength="4" size="4" title="전화번호끝자리" class="textBox" /></td>
            </tr>
            <tr>
              <th><label for="cellno" class="gap">휴대폰</label></th>
              <td><input type="text" name="cellno" id="cellno" maxlength="3" size="3" title="핸드폰첫째자리" class="textBox" /> -
              <input type="text" name="cellno2" maxlength="4" size="4" title="핸드폰중간자리" class="textBox" /> -
              <input type="text" name="cellno3" maxlength="4" size="4" title="핸드폰끝자리" class="textBox" /></td>
            </tr>
            <tr>
              <th><img src="images/member/icon_check.gif" alt="필수" /> <label for="mailaddr">이메일</label></th>
              <td><input type="text" name="mailaddr" id="mailaddr" maxlength="60" size="57" class="textBox" /></td>
            </tr>        
            <tr>
              <th><label for="receivecd" class="gap">메일링 리스트 가입</label></th>
              <td class="mailing">
                <p class="newsletter">메일링리스트에 가입하시면 WebCafe의 뉴스레터를 받아보실 수 있습니다</p>
                <input name="receivecd" type="radio" id="receivecd" value="Y" checked="checked" />
                <label for="receivecd">예 </label>
                <input type="radio" name="receivecd" id="receivecd2" value="N" />
                <label for="receivecd2">아니오</label></td>
            </tr>
          </tbody>
          </table>
          <p class="btnArea">
            <input type="image" src="images/member/btn_join.gif" alt="회원가입" />
            <a href="#"><img src="images/member/btn_cancel.gif" alt="취소" /></a>
          </p>
        </fieldset>  
        </form>    
      </div>
    </div>
    <!-- 콘텐츠 끝 -->
    <hr />
    <!-- 퀵 메뉴 시작 -->
    <div id="quick">
      <h2><img src="images/common/title_quick.gif" alt="퀵 메뉴" /></h2>
      <ul>
        <li><a href="#"><img src="images/common/quick01.gif" alt="HTML에 대해" /></a></li>
        <li><a href="#"><img src="images/common/quick02.gif" alt="게시판" /></a></li>
        <li><a href="#"><img src="images/common/quick03.gif" alt="자료 다운로드" /></a></li>
        <li><a href="#"><img src="images/common/quick04.gif" alt="강좌" /></a></li>
      </ul>
    </div>
    <!-- 퀵 메뉴 끝 -->
  </div>
  <hr />
  <div id="slogan">
    <h2>슬로건</h2>
    <p class="sloganImg"><img src="images/common/icon_coffee.png" alt="커피잔" class="png24" /></p>
    <div class="sloganCon"> <q cite="http://www.w3.org/WAI/">The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect.</q>
      <p class="name">Tim Berners - Lee , W3C Director and inventor of the World Wide Web</p>
    </div>
  </div>
  <hr />
  <!-- 푸터 영역 -->
  <div id="footer">
    <div class="footerInner">
      <p class="footerLogo"><img src="images/common/logo_copyright.gif" alt="WebCafe" /></p>
      <h2>사이트 이용안내</h2>
      <ul class="guideMenu">
        <li class="first-item"><a href="#">회사소개</a></li>
        <li><a href="#">개인정보보호정책</a></li>
        <li><a href="#">이메일주소무단수집거부</a></li>
        <li><a href="#">Contact Us</a></li>
        <li><a href="#">Site map</a></li>
      </ul>
      <address>
      <span class="addr">서울시 마포구 상수동 123-12 한주빌딩 5층</span> <span class="tel">· 전화: 02-1234-1234</span> <span class="fax">· FAX: 02-1234-1234</span> <span class="email">· E-MAIL: webmaster@mail.com</span><br />
      <span class="copyright">Copyright ⓒ Web Cafe CORPORATION ALL RIGHTS RESERVED.</span>
      </address>
    </div>
  </div>
  <!-- 푸터 영역 -->
</div>

<script type="text/javascript">
	function setPng24(obj)
	{
			obj.width = obj.height = 1;
			obj.className = obj.className.replace(/\bpng24\b/i,'');
			obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');"
			obj.src = '';
			return '';
	}
</script>
</body>
</html>
